<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@include file="/context/mytags.jsp"%>
<!DOCTYPE html>
<html lang="zh-CN">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
    <title>班组重点工作情况</title>

    <!-- Bootstrap -->
    <link href="plug-in/bootstrap3/css/bootstrap.min.css" rel="stylesheet">

	<script src="plug-in/jquery/jquery-1.11.3.min.js"></script>
    <script src="plug-in/bootstrap3/js/bootstrap.min.js"></script>
    <script src="plug-in/jquery-plugs/vticker/jquery.vticker.min.js"></script>
    
    <script src="plug-in/echarts3/echarts.min.js"></script>
    
    <style>
      .dowebok { width: 100%; margin: 0 auto;}
      .dowebok li { width: 1480px; overflow: hidden; zoom: 1;}
      
    </style>
  </head>
<body style="overflow:hidden;">
  <input type="hidden" id="showcol" name="showcol" value="${TeamInfo.showcol} ">
  <div class="container-fluid" style="width:98%;height:auto;">
  
  	<div class="row text-center"  style="margin-top:5px;">
       <div class="col-sm-2">
            <div style="padding-top:10px;height:40px;font-weight:bold;background:url(webpage/com/buss/images/title.png) repeat;background-size:100% 100%;" >班组情况</div>
       </div>
       <div class="col-sm-6">
          <div style="padding-top:10px;margin-left:5%;margin-right:5%;height:40px;font-weight:bold;background:url(webpage/com/buss/images/title.png) repeat;background-size:100% 100%;" >${TeamInfo.bzName }当月累计电费回收情况</div>
       </div>
       <div class="col-sm-4">
           <div style="padding-top:10px;height:40px;font-weight:bold;background:url(webpage/com/buss/images/title.png) repeat;background-size:100% 100%;" >当月巡视情况</div>
       </div>
  	</div>
  	
  	<div class="row"  >
       <div class="col-sm-2" style="height:160px;background:url(webpage/com/buss/images/frame.png) no-repeat;background-size:100% 100%;padding:15px;margin-top:30px;">
            <!-- 班组概况-->
             <p > ${TeamInfo.remark }</p>
          
       </div> 
       
       <div class="col-sm-6">
           <!-- 班组当月电费回收情况图表 -->
           <div id="dfhs_charts" style="width: 100%;height:240px;float:left;"></div>
       </div>
       
       <div class="col-sm-4">
           <!-- 班组当月巡视情况图表 -->
           <div id="inspec_charts" style="width: 100%;height:240px;float:left;"></div>
       </div>
  	</div>
  	
  	<div class="row" >
  	  <div class="col-sm-12 text-center" > 	
           <div   style="margin:0 auto;width:580px;font-weight:bold;font-size:16px;height:35px;background:url(webpage/com/buss/images/headline.png) no-repeat;background-size:100% 100%;" >${TeamInfo.bzName }重点工作情况</div>
       </div>
  	</div>
  	
  <div>
	<ul style="padding:0;margin:0;"> 
	    <li style="width: 1480px; overflow: hidden; zoom: 1;">
			<div class="row text-center" style="font-weight:bold;font-size:13px;">
		 	     <div class="col-md-1" style="width:5%;">用检员</div>
		  	     <div class="col-md-1" style="width:5%;">用检户</div>
		  	     <div class="col-md-1" style="width:5%;">欠  费<br/>（万）</div>
		  	     <div class="col-md-1" style="width:5%;">回收率<br/>（%）</div>
		  	     <div class="col-md-1" style="width:7%;">当月巡检<br/>户数</div>
		  	     <div class="col-md-1" style="width:8%;">已参与电力<br/>保障次数</div>
		  	     <div class="col-md-1" style="width:10%;">当月应急抢修<br/>/故障处理次数</div>
		  	     <div class="col-md-1" style="width:10%;">累计已办结<br/>传票数</div>
		  	     <div class="col-md-1" style="width:10%;">累计已办结<br/>95598工单数</div>
		  	     <div class="col-md-1" style="width:10%;">累计已办结<br/>12345工单数</div>
		  	     <div class="col-md-1" style="width:10%;">阶段性重点工作</div>  	     
		  	     <div class="col-md-1" style="width:15%;">
		  	         <div class="row">
		  	         	<c:choose>
		  	         	   <c:when test="${TeamInfo.showcol==0}">
		  	         	    	<div class="col-md-6">低压费控<br/>推广户数</div>
		  	         	    	<div class="col-md-6">预结算比例<br/>（%）</div>
		  	         	   </c:when>
		  	         	   <c:when test="${TeamInfo.showcol==1}">
		  	         	    	<div class="col-md-6">高压费控转换率</div>
		  	         	    	<div class="col-md-6">预结算比例<br/>（%）</div>
		  	         	   </c:when>
		  	         	   <c:otherwise>
		  	         	       <div class="col-md-12">预结算比例<br/>（%）</div>
		  	         	   </c:otherwise>
		  	         	</c:choose>	  	            
		               
		              </div>
		         </div> 
		  	  </div>
		 </li>
     </ul>
	</div>
	
  	<div class="dowebok">
		<ul style="padding:0;margin:0;"> 
		
		</ul>
	</div>
	
  </div>
  
  <script type="text/javascript">
  
     //取前后几名计数器
     var count = 3;
      $(function(){
    	  loadDfhsChats();
          loadInspeChats();
          loadKeyWork('0');

           //每小时刷新一次
          setInterval(function(){
        	  loadDfhsChats();
              loadInspeChats();
              loadKeyWork('1');
          },60*60*1000); 
      });     
    	
       
    	
    	 // 班组电费回收图表加载
    	function loadDfhsChats(){
            var dfhsChart = echarts.init(document.getElementById('dfhs_charts'));
            dfhsChart.clear();  
            dfhsChart.showLoading({text: '正在努力的读取数据中...'});  
            
            $.getJSON('homeController.do?getTeamPowerRateRecovery&team=${teamId}', function (data) {  
                if (data.success) {  
                	dfhsChart.setOption($.parseJSON(data.msg));  
                	dfhsChart.hideLoading();  
                } else {  
                    alert('提示', data.msg);  
                }  
            }); 
    	}
    	 
    	 // 班组当月巡视情况图表加载
    	function loadInspeChats(){ 
            var inspecChart = echarts.init(document.getElementById('inspec_charts'));
            inspecChart.clear();  
            inspecChart.showLoading({text: '正在努力的读取数据中...'}); 
        	
        	$.getJSON('homeController.do?getInspections&team=${teamId}', function (data) {  
                 if (data.success) {  
                	 inspecChart.setOption($.parseJSON(data.msg));  
                	 inspecChart.hideLoading();  
                 } else {  
                     alert('提示', data.msg);  
                 }  
             });
    	 }
    	 
    	//回收率前5名
        var rc5first;
    	//回收率后5名
    	var rc5last;
    	
    	//预结算比例前5名
        var sp5first;
    	//预结算比例后5名
    	var sp5last;
    	
    	// 班组当月重点工作加载 
    	function loadKeyWork(flag){
    		 $(".dowebok ul ").empty();
    		 var showcol = $("#showcol").val().trim();
    		 
    		 $.getJSON('homeController.do?getKeyWork&team=${teamId}', function (data) {  
                 if (data.success) {  
                	 var i = 0;
                	 
                	 //回收率排序
                	 sortRcDesc(data.obj);
                	 //预结算比例排序
                	 sortSpDesc(data.obj);
                	 
                	 $.each(data.obj,function(n,value) { 
                		  var key_work = '';
                		  var bgColor ="#f4f7f9";
                          if(value.key_work){
                        	  key_work = value.key_work;
                          }
                          i++;
                          if(i%2==0)bgColor="#fdefb";
                          var lis  = " <li  style=\"width: 1500px; overflow: hidden; zoom: 1;background-color:"+bgColor+";\">"+
                                         "<div class=\"text-center\" style=\"font-size:13px;margin-left:-15px;\">"+
		                            	    " <div style=\"width:5%;float:left;margin-bottom:10px;margin-top:-10px;\">" + formatNull(value.checker_name) +"</div>"+
		                            	    " <div  style=\"width:5%;float:left;margin-bottom:10px;margin-top:-10px;\">" + formatNull(value.userCheckers) +"</div>"+
		                            	    " <div  style=\"width:5%;float:left;margin-bottom:10px;margin-top:-10px;\">" + formatNull(value.arrearage) +"</div>";
		                            	    
		                           lis  += rsStr(rc5first,rc5last,value.rateofrecovery);
		                           
		                           lis  +=  " <div  style=\"width:7%;float:left;margin-bottom:10px;margin-top:-10px;\">" + formatNull(value.inspections) +"</div>"+
		                            	    " <div style=\"width:8%;float:left;margin-bottom:10px;margin-top:-10px;\">" +formatNull( value.emergency_repairs) +"</div>"+
		                            	    " <div  style=\"width:10%;float:left;margin-bottom:10px;margin-top:-10px;\">" +formatNull(value.emergency_repairs) +"</div>"+
		                            	    " <div style=\"width:10%;float:left;margin-bottom:10px;margin-top:-10px;\">" + formatNull(value.summon) +"</div>"+
		                            	    " <div  style=\"width:10%;float:left;margin-bottom:10px;margin-top:-10px;\">" + formatNull(value.wos95598) +"</div>"+
		                            	    " <div  style=\"width:10%;float:left;margin-bottom:10px;margin-top:-10px;\">" + formatNull(value.wos12345) +"</div>"+
		                            	    " <div  style=\"width:10%;float:left;margin-bottom:10px;margin-top:-10px;\">" + formatNull(key_work) +"重点工作 </div>  	";
		                            	    
			                  		 if(showcol!='' && showcol==0){ 
			                  			  lis += " <div style=\"width:7%;float:left;margin-bottom:10px;margin-top:-10px;\">" + formatNull(value.low_extension) +"</div>";
			                  			  lis  += spStr(sp5first,sp5last,value.settle_proportion,7);
			                  			 // lis += " <div style=\"width:7%;float:left;margin-bottom:10px;margin-top:-10px;\">" + value.settle_proportion +"</div>";
			                  		 }else if(showcol!='' && showcol==1){ 
			                  			  lis += " <div style=\"width:7%;float:left;margin-bottom:10px;margin-top:-10px;\">" + formatNull(value.high_extension) +"</div>";
			                  			  lis  += spStr(sp5first,sp5last,value.settle_proportion,7);
			                  			  //lis += " <div style=\"width:7%;float:left;margin-bottom:10px;margin-top:-10px;\">" + value.settle_proportion +"</div>";
			                  		 }else{
			                  			  lis  += spStr(sp5first,sp5last,value.settle_proportion,14);
			                  			 // lis +=  " <div style=\"width:14%;float:left;margin-bottom:10px;margin-top:-10px;\">" + value.settle_proportion +"</div>";
			                  		 }
			                  		 
		                  		    
			                  		 lis +=  " </div>"+
		                            "</li>";
                                   
                                   
                		  $(".dowebok ul ").append(lis);       
                      });
                      
                	//列表定时滚动 初始加载
                	if(flag=='0'){
	                     $('.dowebok').vTicker({
	                		 speed: 1000,     //滚动速度，单位毫秒。
	                		 pause: 5000,        //暂停时间，就是滚动一条之后停留的时间，单位毫秒。
	                		 showItems: 10,      //显示内容的条数
	                		 animation: 'fade',  //动画效果，默认是fade，淡出。
	                		 mousePause: true,   //鼠标移动到内容上是否暂停滚动，默认为true。
	                		 //height: 235,        //滚动内容的高度。
	                		 direction: 'up'     //滚动的方向，默认为up向上，down则为向下滚动。
	                  	  }); 
                	}
                 }
             });
    	 }
    	
     //回收率排序 
     function sortRcDesc(arrs){	  
    	 rc5first = new Array();  	  
    	 var first5 = arrs.sort(function(a,b){
    		 if (a.rateofrecovery<b.rateofrecovery) {return 1}; 
    		 if (a.rateofrecovery>b.rateofrecovery) {return -1};
    	 });
    	 
    	 //取前5名
    	 $.each(first5,function(n,value) {  
             if(n<count){
            	 rc5first.push(value.rateofrecovery);
             }     
         });
    	 
    	 rc5last = new Array();    	 
    	 var last5 = arrs.sort(function(a,b){
    		 if (a.rateofrecovery<b.rateofrecovery) {return -1}; 
    		 if (a.rateofrecovery>b.rateofrecovery) {return 1};
    	 });
    	 
    	  
    	 //取后5名
    	 $.each(last5,function(n,value) {  
             if(n<count){
            	 rc5last.push(value.rateofrecovery);
             }
     
         });  
    	
     }
     
     //预结算比例排序 
     function sortSpDesc(arrs){	  
    	 sp5first = new Array();  	  
    	 var first5 = arrs.sort(function(a,b){
    		 if (a.settle_proportion<b.settle_proportion) {return 1}; 
    		 if (a.settle_proportion>b.settle_proportion) {return -1};
    	 });
    	 
    	 //取前5名
    	 $.each(first5,function(n,value) {  
             if(n<count){
            	 sp5first.push(value.settle_proportion);
             }     
         });
    	 
    	 sp5last = new Array();    	 
    	 var last5 = arrs.sort(function(a,b){
    		 if (a.settle_proportion<b.settle_proportion) {return -1}; 
    		 if (a.settle_proportion>b.settle_proportion) {return 1};
    	 });
    	 
    	  
    	 //取后5名
    	 $.each(last5,function(n,value) {  
             if(n<count){
            	 sp5last.push(value.settle_proportion);
             }
     
         });  
    	
     }
   
   
     //返回当前数值的排名
     function getSortTag(arrs,val){
    	 var cnt;
    	 $.each(arrs,function(n,value) {       		 
            if(value==val){
            	cnt = n;
            }             
         });
    	 if(cnt<count){
    		 return cnt+1; 
    	 }else{
    		 return -1; 
    	 }   
     }
       
     //回收率字符串拼接
    function rsStr(rc5first,rc5last,val){
    	var lis = '';
    	var f5 = getSortTag(rc5first,val); //前5名
        if(f5!=-1){
     	   lis  += " <div style=\"width:5%;float:left;margin-bottom:10px;margin-top:-10px;background:#44BB5C\">" + val +"</div>";
        }else{
     	   var l5 = getSortTag(rc5last,val); //后5名
     	   if(l5!=-1){
     	  	   lis  += " <div style=\"width:5%;float:left;margin-bottom:10px;margin-top:-10px;background:#E6941A\">"  + val +"</div>";
     	   }else{
     		   lis  += " <div style=\"width:5%;float:left;margin-bottom:10px;margin-top:-10px;\">" +val +"</div>";
     	   }
        }
    	return lis;
    }
     
    //回收率字符串拼接
    function spStr(sp5first,sp5last,val,bl){
    	var lis = '';
    	var f5 = getSortTag(sp5first,val); //前5名
        if(f5!=-1){
     	   lis  += " <div style=\"width:"+bl+"%;float:left;margin-bottom:10px;margin-top:-10px;background:#44BB5C\">" + val +"</div>";
        }else{
     	   var l5 = getSortTag(sp5last,val); //后5名
     	   if(l5!=-1){
     	  	   lis  += " <div style=\"width:"+bl+"%;float:left;margin-bottom:10px;margin-top:-10px;background:#E6941A\">"  + val +"</div>";
     	   }else{
     		   lis  += " <div style=\"width:"+bl+"%;float:left;margin-bottom:10px;margin-top:-10px;\">" +val +"</div>";
     	   }
        }
    	return lis;
    }
    
    function formatNull(val){
    	if(!val || val=='null'){
    		return "&nbsp;";
    	}
    	return val;
    	
    }
    	
     
    </script>
</body>
</html>